<style>
	#div1{
		float: left;
		margin: 10px;
	}
	#div2{
		float: left;
		margin: 10px;
	}
	#div3{
		float: left;
		margin: 10px;
	}
	#div4{
		float: left;
		margin: 10px;
	}
	#div5{
		float: left;
		margin: 10px;
	}
	.predefine{
		font-weight: bold;
		padding: 10px;
		border: 1px solid #fff;
		-webkit-box-shadow: 0px 0px 1px 2px rgba(0, 0, 0, 0.1);
   		-moz-box-shadow: 0px 0px 1px 2px rgba(0, 0, 0, 0.1);
   		box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.1);
  		
	}
	
</style>

<div class="row-fluid">
<div class="span9">
<h4>Add a new Job Profile</h4>
<?php echo form_open('founder/jobprofile/getallprofilelist/')?>
<?php echo validation_errors(); ?>


<table>

<!--	<tr>
		<td>
			User:
		</td>
		<td>
			<select name="users_get" id="users_get">
				<option value="" >
					-- Select User --
				</option>
				<?php
				foreach($users_get as $user)
				{
					?>
					<option value="<?= $user->id ?>"
						<?= $user->username; ?>
					</option>
					<?php
				}?>
			</select>

		</td>
	</tr>-->

	<tr>
		<td>
			<b>Name:</b>
		</td>
		<td>
		<input type="hidden" name="users" value="<?php echo $userid; ?>"/>
		
		<input type="text" name="user" value="<?php echo ucfirst($this->common_model->get_username_id($userid)); ?>" readonly/>
		
		</td>
	</tr>
	<tr>
		<td>
			<b>Designation:</b>
		</td>
		<td>
			<select name="user_type" id="user_type">
				<option value="" >
					-- Select Designation --
				</option>
				<?php
				foreach($query as $designation)
				{
					?>
					<option value="<?= $designation->id?>"<?php
	if(isset($edit))
{
	if($edit['user_type_id'] == $designation->id){
		echo 'selected = "selected"';
		}
	}
else
{
	echo set_select('user_type',$designation->id);
	}?> >
						<?= $designation->name?>
					</option>
					<?php
				}?>
			</select>

		</td>
	</tr>
	<tr>
		<td>

<script type="text/javascript">
    function doMath()
    {
        // Capture the entered values of two input boxes
        var input1 = document.getElementById('id1').value;
        var input2 = document.getElementById('id2').value;

        // Add them together and display
        var sum = parseInt(input1) + parseInt(input2);
		if(sum == 100)
		{
			//alert("ok");
			return true;
		}
	else{
		
		alert("The sum of two fields in efficiency should be 100");
		return false;
		
		}
        document.write(sum);
    }
</script>

			<b>Efficiency:</b>
		</td>
		
		<td id="efficiency">
			

		</td>
	</tr>
	<tr>
		<td>
		</td>
		<td>
			<div id="addinput">
					<a href="#" id="addNew">
						<!--<i class="icon-plus-sign"> </i>
						Add Efficiency-->
					</a>
				</p>
			</div>
		</td>
	</tr>

	<tr>
		<td>
			<b>Skills [ minimum six ]:</b>
		</td>

<script type="text/javascript">
var v=1;
function check(i) {      
  if(i.value > 100 || isNaN(i.value)) {
    i.value=v;
    alert("Less than or equal to 100");
  }
  else
    v=i.value;
}</script>
		
		<td id="skills">
			<?php
			if(is_array(@$getskills))
			{
				foreach($getskills as $skill)
				{
				?>
					

					<?php
				}
			}?>
		</td>
	</tr>


	<tr>
		<td>
		</td>
		<td>
			<div id="addinput2">
				<p>
					<a href="#" id="addNew2">
					<i class="icon-plus-sign"> </i>
						Add Skills
					</a>
				</p>
			</div>
		</td>
	</tr>
	<tr>
		<td>
			<b>Tools [ minimum four ]:</b>
		</td>
		<td id="tools">
			<?php
			if(is_array(@$gettools))
			{
				foreach($getefficiency as $tool)
				{
					?>
					<input type="text" name="toolname" >
					<?php
				}
			}?>
		</td>
	</tr>

	<tr>
		<td>
		</td>
		<td>
			<div id="addinput3">
				<p>
					<a href="#" id="addNew3">
					<i class="icon-plus-sign"> </i>
						Add Tools
					</a>
				</p>
			</div>
		</td><td></td>
	</tr>
<!--	<tr>
		<td>
			<b>Hobbies:</b>
		</td>
		<td>
		
		<? 
$rowcount = count($query2);

echo "<div class='text-info' id='div1'>";
$i = 0;
foreach ($query2 as $row) {?>
	 <input type="checkbox" name="hobbies[]" value="<?php echo $row->id ?>">
		<?php echo ucfirst($row->name); ?><br>
 <?php
  $i++;

  if ($i == floor($rowcount / 5)) {
     
      echo "</div><div class='text-info' id='div2'>";
  }
  
  if ($i == floor($rowcount / 2.5)) {
     
      echo "</div><div class='text-info' id='div3'>";
  }
  if ($i == floor($rowcount / 1.65)) {
     
      echo "</div><div class='text-info' id='div4'>";
  }
   if ($i == floor($rowcount / 1.22)) {
     
      echo "</div><div class='text-info' id='div5'>";
  }
}
echo "</div>";
?>
		
		
		
		
		<?php
		/*foreach($query2 as $row)
	  	{
		echo '<input type="checkbox" name="hobbies[]" value="'.$row->id.'">';
	    echo "&nbsp";
		echo $row->name;
		echo "<br>";  
	  	}*/ ?>
		
		</td>
		
		
			
	</tr>-->


	<tr>
		<td><input type="submit" value="Add" class="btn btn-info" onclick="return doMath();" />
		</td>
	</tr>


	<script type="text/javascript">
		$(document).ready(function(e)
			{

			});


		$("#user_type").change(function()
			{
				//alert(abcd);
			 	var user_type_id = $("#user_type").val();

				$.post('<?php echo site_url('founder/jobprofile/get_efficiency_by_user_type_id');?>',
					{
						user_type : user_type_id
					}, function(data)
					{
						//alert(data);
						$("#efficiency").html("");
						$("#efficiency").html(data);
					});

				$.post('<?= site_url('founder/jobprofile/get_skills_by_user_type_id');?>',
					{
						user_type : user_type_id
					}, function(data)
					{
						$("#skills").html(data)
					});


				$.post('<?= site_url('founder/jobprofile/get_tools_by_user_type_id');?>',
					{
						user_type : user_type_id
					}, function(data)
					{
						$("#tools").html(data)
					});

			})

	</script>

	<script  src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js">
	</script>
	<script type="text/javascript">
		$(function()
			{
				j=1;
				var addDiv = $('#addinput');
				var i = $('#addinput p').size() +  1;
				$('#addNew').live('click', function()
					{
						$('<p><input type="text" id="p_new1" size="40" name="efficiencyname[]" value="" placeholder="Efficiency Name" /> <input type="text" id="p_new2" size="40" name="efficiencylevel[]" value="" placeholder="%" style="width:20px"/> <a href="#" id="remNew"> <i class="icon-minus-sign" id="minus"></i></a> </p>').appendTo(addDiv);
						i++;

						return false;
					});



				$('#remNew').live('click', function()
					{
						if( i > 2 )
						{
							$(this).parents('p').remove();
							i--;
						}
						return false;
					});
			});

	</script>

	<script type="text/javascript">
		$(function()
			{
				var addDiv2 = $('#addinput2');
				var i = $('#addinput2 p').size() + 1;

				$('#addNew2').live('click', function()
					{
						$('<p><input type="text" id="p_new1" size="40" name="skillname[]' + i +'" value="" placeholder="Skill Name"/><input type="hidden" id="p_new1" size="40" name="skillid[]' + i +'" value="0" placeholder="Skill Id"/> <input type="text" id="p_new2" size="40" name="skilllevel[]' + i +'" value="" placeholder="%" style="width:20px" /> <a href="#" id="addNew2"><i class="icon-plus-sign"> </i></a> <a href="#" id="remNew2"> <i class="icon-minus-sign" id="minus"></i></a> </p>').appendTo(addDiv2);
						i++;

						return false;
					});


				$('#remNew2').live('click', function()
					{
						if( i > 2 )
						{
							$(this).parents('p').remove();
							i--;
						}
						return false;
					});
			});

	</script>


	<script type="text/javascript">
		$(function()
			{
				var addDiv3 = $('#addinput3');
				var i = $('#addinput3 p').size() + 1;

				$('#addNew3').live('click', function()
					{
						$('<p><input type="text" id="p_new_1" size="40" name="toolname[]' + i +'" value="" placeholder="Tool Name" /> <input type="text" id="p_new2" size="40" name="toollevel[]' + i +'" value="" placeholder="%" style="width:20px" /><a href="#" id="addNew3"> <i class="icon-plus-sign"> </i>	</a><a href="#" id="remNew3"> <i class="icon-minus-sign" id="minus"></i></a> </p>').appendTo(addDiv3);
						i++;

						return false;
					});


				$('#remNew3').live('click', function()
					{
						if( i > 2 )
						{
							$(this).parents('p').remove();
							i--;
						}
						return false;
					});
			});

	</script>
	

	
</table>
</form>
</div>



<div class="span2 predefine">
<br><br>
	<a href="<?= site_url('founder/jobprofile/addefficiency');?>"><i class="icon-plus-sign" id="plus"></i> Define new Efficiency</a><br><br>
	<a href="<?= site_url('founder/jobprofile/addskills');?>"><i class="icon-plus-sign" id="plus"></i> Define new Skills</a><br><br>
	<a href="<?= site_url('founder/jobprofile/addtools');?>"><i class="icon-plus-sign" id="plus"></i> Define new Tools</a><br><br>
	<a href="<?= site_url('founder/jobprofile/addhobbies');?>"><i class="icon-plus-sign" id="plus"></i> Define new Hobbies</a><br><br>
</div>
</div>